import styled from "styled-components";
const RoomItemWrapper = styled.div`
  box-sizing: border-box;
  width: ${(props) => props.$itemWidth};
  padding: 8px;
  flex-shrink: 0;
  .inner {
    .cover {
      position: relative;
      padding: 55.55% 0px 0px;
      overflow: hidden;
      img {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    .room-name {
      font-size: 16px;
      font-weight: 700;

      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }
  }
`;
export default RoomItemWrapper;
